<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv=X-UA-Compatible content="IE=edge">
    <meta name=format-detection content="telephone=no">
    <meta name=format-detection content="email=no">
    <meta name=apple-mobile-web-app-capable content=yes>
    <meta name=apple-mobile-web-app-status-bar-style content=black>
    <meta name=full-screen content=yes>
    <meta name=browsermode content=application>
    <meta name=x5-orientation content=portrait>
    <meta name=x5-fullscreen content=true>
    <meta name=x5-page-mode content=app>
    <meta content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=2.0, user-scalable=no, width=device-width"
          name="viewport">
    <title>邀请有礼</title>
    <script src="/common/vue.min.js"></script>
    <script src="/common/axios.min.js"></script>
    <script src="/common/jquery.min.js"></script>
    <link rel="stylesheet" href="/wap/activity/dynamic/invite/index.css">
</head>
<body>
<div id="invite" class="clear">
    <header>
        <img src="/wap/activity/dynamic/invite/images/3.png" alt="">
    </header>
    <section class="ini2">
        <span class="top"></span>
        <ul class="ini2-ul clear">
            <li class="tel">
                <input type="tel" placeholder="请输入手机号" @input="inps" class="inputs">
                <span v-if="enroll.res === 0" :class="enroll.cla" @click="gain">获取验证码</span>
                <span v-else-if="enroll.res === 1" :class="enroll.cla">输入手机号码</span>
                <span v-else-if="enroll.res === 2" :class="enroll.cla">在{{enroll.num}}秒后重试</span>
            </li>
            <li class="yzm"><input class="inputs" type="text" placeholder="请输入验证码"></li>
            <li class="pas"><input class="inputs" type="password" placeholder="请输入密码"></li>
            <span v-if="base.sur" class="buts">{{base.text}}</span>
            <p class="but" @click="getNew">确认注册并下载APP</p>
        </ul>
    </section>
</div>

<script th:inline="javascript">
    var baseUrl = [[${baseUrl}]];
</script>
<script src="/wap/activity/dynamic/invite/index.js"></script>
<script>
    var invite = new Vue({
        el: '#invite',
        data: {
            enroll: {
                res: 0,
                cla: 'active',
                phone: '',
                num: 0
            },
            base: {
				sur: false,
				text: ''
			}
        },
        methods: {
            /*页面数据获取*/
            getNew: function () {
                var sur = $('.inputs');
                var _this = this;
                axios.post(baseUrl + 'api/auth/register/phone', {
                    phone: sur[0].value,
                    password: sur[2].value,
                    smsCode: sur[1].value,
                    type: 'invite',
                    inviterId: GetQueryString('inviterId')
                }).then(function (response) {
                    console.log(response)
                    if (response.data.code === 20000) {
                        window.location.href='https://www.luobobb.com/wap/app/download'
                    }else{
						_this.base = {
							sur: true,
							text: response.data.message
						}
					}
                }).catch(function (error) {
                    console.log(error);
                });
            },
            gain: function () {
                var _this = this;
                axios.post(baseUrl + 'api/common/sms/send', {
                    phone: _this.enroll.phone,
                    type: 1
                }).then(function (response) {
                    if (response.data.code === 20000) {
                        _this.enroll = {res: 2, cla: 'active', num: 60};
                        var se = setInterval(function () {
                            _this.enroll.num--;
                            if(_this.enroll.num === 0){
                                clearInterval(se);
                                _this.enroll = {res: 0, cla: '', num: 0};
                            }
                        },1000)
                    }
                }).catch(function (error) {
                    console.log(error);
                });
            },
            inps: function (val) {
                var phone = val.path[0].value;
                if(!(/^1[34578]\d{9}$/.test(phone))){
                    this.enroll = {res: 1, cla: 'active', phone: ''};
                    return false;
                }else{
                    this.enroll = {res: 0, cla: '', phone: phone};
                }
				this.base.sur = false
            }
        },
        created: function () {
        }
    });
</script>
</body>
</html>